<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			ul {
			    list-style-type: none;
			    margin: 0;
			    padding: 0;
			    overflow: hidden;
			    border: 1px solid #e7e7e7;
			    background-color: #f3f3f3;
			}
			
			li {
			    float: left;
			}
			
			li a {
			    display: block;
			    color: #666;
			    text-align: center;
			    padding: 14px 16px;
			    text-decoration: none; /* 去除文本下滑线 */
			}
			
			li a:hover:not(.active) {
			    background-color: #ddd;
			}
			
			li a.active {
			    color: white;
			    background-color: #4CAF50;
			}
		</style>
	</head>
	<body>
		<ul>
		  <li><a class="active" href="#home">主页</a></li>
		  <li><a href="#news">新闻</a></li>
		  <li><a href="#contact">联系</a></li>
		  <li><a href="#about">关于</a></li>
		</ul>
	</body>
</html>